<template>
    <div class="op-main">
        <div class="op-main__set">
            <tableHeadSetting :checkData="checkData" />
        </div>
        <el-table :data="tableData" style="width: 100%" :border="true" stripe>
            <el-table-column prop="" label="部门">
            </el-table-column>
            <el-table-column prop="" label="产品线">
            </el-table-column>
            <el-table-column prop="" label="技术组">
            </el-table-column>
            <el-table-column prop="" label="姓名">
            </el-table-column>
            <el-table-column prop="" label="工号">
            </el-table-column>
            <el-table-column prop="" label="住址">
            </el-table-column>
            <el-table-column prop="" label="电话">
            </el-table-column>
        </el-table>
    </div>
</template>

<script>
import tableHeadSetting from './../components/tableHeadSetting.vue';

export default {
    name: 'tableHeadSetView',
    components: { tableHeadSetting },
    data() {
        return {
            tableData: [],
            checkData: [
                {
                    code: 'dep',
                    name: '部门',
                    shown: true
                },
                {
                    code: 'pro',
                    name: '产品线',
                    shown: true
                },
                {
                    code: 'tec',
                    name: '技术组',
                    shown: true
                },
                {
                    code: 'name',
                    name: '姓名',
                    shown: true
                },
                {
                    code: 'number',
                    name: '工号',
                    shown: true
                },
                {
                    code: 'address',
                    name: '住址',
                    shown: true
                },
                {
                    code: 'phone',
                    name: '电话',
                    shown: true
                },
                {
                    code: 'metricName',
                    name: '指标名称',
                    shown: false
                },
                {
                    code: 'metricStatus',
                    name: '指标状态',
                    shown: false
                },
                {
                    code: 'metriOwner',
                    name: '负责人',
                    shown: false
                }
            ]
        }
    }
}
</script>

<style lang="less" scoped>
.op-main {
    padding: 20px;
    &__set {
        display: flex;
    }
}
</style>